<template>
  <el-dialog :visible.sync="visible" v-dialogDrag :title="title" :close-on-click-modal="false" class="tl-dialog" width="1200px" @open="open" @close="close">
    <el-tabs v-model="activeTab" type="card" @tab-click="tabClick" :before-leave="changeFunction">
      <el-tab-pane label="基础信息" name="basic">
        <el-form class="tl-form" ref="form" :model="model" :rules="rules" label-width="150px" :disabled="disableEditSubmit">
          <el-row>
            <el-col :span="12">
              <el-form-item label="团队名称" prop="name" :rules="rules.validateRequire">
                <el-input v-model="model.name"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="团队编码" prop="code">
                <el-input v-model="model.code"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <!-- <el-col :span="12">
              <el-form-item label="所属部门" prop="deptid">
                <tl-ref-dept v-model="model.deptid" :initDisplayData.sync="model.dispdeptid" dataType="id" :singleSelect="true"></tl-ref-dept>
              </el-form-item>
            </el-col> -->
            <el-col :span="12">
              <el-form-item label="团队类型" prop="type" :rules="rules.validateRequire">
                <el-select v-model="model.type" filterable clearable>
                  <el-option v-for="item in codeModel.typeList" :key="item.code" :label="item.name" :value="item.code" />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="直接上级团队" prop="name">
                <!-- <el-input v-model="model.disphighteam" :disabled="true" class="tl-ref-selector">
                  <el-button slot="append" type="primary" icon="el-icon-search" @click="openBaseTeamInfoRefDialog(1)"></el-button>
                </el-input> -->
                <tl-ref-list v-model="model.highteam" :initDisplayData.sync="model.disphighteam" :refTitle="teamRefTitle" :queryDataUrl="url.queryTeamList" :externalQueryParam="selectLowTeam" :singleSelect="false" @confirm="copyLowTeam"></tl-ref-list>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="直接下级团队" prop="name">
                <!-- <el-input v-model="model.displowteam" :disabled="true" class="tl-ref-selector">
                  <el-button slot="append" type="primary" icon="el-icon-search" @click="openBaseTeamInfoRefDialog(2)"></el-button>
                </el-input>  -->
                <tl-ref-list v-model="model.lowteam" :initDisplayData.sync="model.displowteam" :refTitle="teamRefTitle" :queryDataUrl="url.queryTeamList" :externalQueryParam="selectHighTeam" :singleSelect="false" @confirm="copyHighTeam"></tl-ref-list>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="排序码" prop="sortcode">
                <el-input-number v-model="model.sortcode" controls-position="right" :step="1" :min="0" style="width:100%"></el-input-number>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="有效" prop="enabled">
                <el-radio-group v-model="model.enabled">
                  <el-radio :label="parseInt(item.code)" v-for="item in codeModel.enabledList" :key="item.code">{{ item.name }}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="备注" prop="description">
                <el-input v-model="model.description" type="textarea" :rows="2"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="团队成员列表" name="teamUserInfo">
        <tl-base-team-user ref="teamUser" :parentId="model.id"></tl-base-team-user>
      </el-tab-pane>
    </el-tabs>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="doSave" :loading="saveLoading" v-if="disableEditSubmit === false">保存</el-button>
      <el-button :type="disableEditSubmit === false ? 'text' : 'primary'" @click="doCancelEdit">取消</el-button>
    </div>
    <tl-base-team-info-ref ref="baseTeamInfoRef" :isSingleSelect="isshowref" @fatherMethod="getTeamInfo" :externalSelectedRowKeys="selectTeams" :externalQueryParam="teamQuery"></tl-base-team-info-ref>
  </el-dialog>
</template>

<script>
/** mixins */
import { mixin_edit } from '@tapui/mixins/mixin_edit'
import tlBaseTeamInfoRef from './refList.vue'
import tlBaseTeamUser from '../baseTeamUser/indexFrame'
/** 子组件 */
/** 工具类 */
import { putAction, getAction, postAction, deleteAction } from '@tapui/utils/http'
/** VUE配置 */
export default {
  mixins: [mixin_edit],
  components: { tlBaseTeamInfoRef, tlBaseTeamUser },
  data() {
    return {
      moduleTitle: '团队信息',
      urlPrefix: '/base/teamInfo/',
      activeTab: 'basic',
      url: {
        doSave: '/base/teamInfo/doSave',
        queryTeamList: 'base/teamInfo/list'
      },
      teamRefTitle: '团队选择',
      isshowref: false,
      type: 1,
      selectTeams: '',
      teamQuery: {},
      selectHighTeam: {},
      selectLowTeam: {}
    }
  },
  methods: {
    loaded() {
      // 页面加载完毕执行
      this.activeTab = 'basic'
      if (!this.model.id) {
        this.model.id = 0
      }
      let sqlhigh = ' id != ' + this.model.id
      if (this.model.highteam) {
        sqlhigh = sqlhigh + ' and id not in ( ' + this.model.highteam + ' )'
      }
      this.selectHighTeam['whereSql'] = sqlhigh
      if (!this.model.id) {
        this.model.id = 0
      }
      let sqllow = ' id != ' + this.model.id
      if (this.model.lowteam) {
        sqllow = sqllow + ' and id not in ( ' + this.model.lowteam + ')'
      }
      this.selectLowTeam['whereSql'] = sqllow
    },
    copyLowTeam(selectData) {
      if (!this.model.id) {
        this.model.id = 0
      }
      let sqllow = ' id != ' + this.model.id
      if (selectData && selectData.length > 0) {
        let lowteamids = ''
        for (let lowteam of selectData) {
          lowteamids += lowteam['id']
          lowteamids += ','
        }
        if (lowteamids.length > 0) {
          lowteamids = lowteamids.substring(0, lowteamids.length - 1)
          sqllow = sqllow + ' and id not in ( ' + lowteamids + ')'
        }
      }
      this.selectHighTeam['whereSql'] = sqllow
    },
    copyHighTeam(selectData) {
      if (!this.model.id) {
        this.model.id = 0
      }
      let sqlhigh = ' id != ' + this.model.id
      if (selectData && selectData.length > 0) {
        let highteamids = ''
        for (let highteam of selectData) {
          highteamids += highteam['id']
          highteamids += ','
        }
        if (highteamids.length > 0) {
          highteamids = highteamids.substring(0, highteamids.length - 1)
          sqlhigh = sqlhigh + ' and id not in ( ' + highteamids + ' )'
        }
      }
      this.selectLowTeam['whereSql'] = sqlhigh
    },
    openBaseTeamInfoRefDialog(type) {
      this.type = type
      if (!this.model.id) {
        this.model.id = 0
      }
      let sql = ' id != ' + this.model.id
      if (type === 1) {
        this.selectTeams = this.model.highteam
        if (this.model.lowteam) {
          sql = sql + ' and id not in ( ' + this.model.lowteam + ')'
        }
        this.teamQuery['whereSql'] = sql
      } else if (type === 2) {
        this.selectTeams = this.model.lowteam
        if (this.model.highteam) {
          sql = sql + ' and id not in ( ' + this.model.highteam + ' )'
        }
        this.teamQuery['whereSql'] = sql
      }
      this.$refs.baseTeamInfoRef.visible = true
    },
    changeFunction(item) {
      if (item === 'teamUserInfo') {
        if (!this.model.id) {
          this.$tap
            .confirm('是否保存团队基础信息？')
            .then((_) => {
              this.doSave()
            })
            .catch((_) => {
              return false
            })
             return false
        }
      }
    },
    tabClick(tab) {
      if (tab.name === 'teamUserInfo') {
        this.$nextTick((_) => {
          this.$refs.teamUser.loadData({})
        })
      }
    },
    doSave() {
      if (!this.beforeSubmit()) {
        return
      }
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.saveLoading = true
          postAction(this.url.doSave, this.model)
            .then((res) => {
              if (res.success) {
                this.$tap.message('保存成功', 'success')
                this.model = res.result
                this.$emit('refresh')
              } else {
                this.$tap.alert(res.message, 'warning')
              }
              this.afterSubmit()
              this.saveLoading = false
            })
            .catch((err) => {
              this.saveLoading = false
            })
        } else {
          return false
        }
      })
    },
    getTeamInfo(val, dispval) {
      if (this.type === 1) {
        this.$set(this.model, 'highteam', val)
        this.$set(this.model, 'disphighteam', dispval)
      } else if (this.type === 2) {
        this.$set(this.model, 'lowteam', val)
        this.$set(this.model, 'displowteam', dispval)
      }
    }
  }
}
</script>
